import axios from 'axios'
// 从 vant 组件库中按需导入 Toast 提示消息组件
import { Toast } from 'vant'
// 导入 vuex 模块
import store from '@/store/index.js'
console.log(store)

// 创建 axios 的实例对象，并共享出去
const request = axios.create({
  // 请求的根路径
  baseURL: 'http://www.liulongbin.top:8000'

})

// 1. 拦截器的挂载，一定要放到 request 实例创建之后
// 2. 由于我们在项目中是基于 request 实例对象发起的请求，因此，拦截器一定要挂载给 request，而不是 axios！！！

// 添加请求拦截器
// 在请求拦截器的第一个 function 中，形参 config 就是每次请求时候的配置选项
request.interceptors.request.use(
  function (config) {
    // 在发送请求之前做些什么
    // 展示 loading 效果
    Toast.loading({
      message: '加载中...',
      // 防止自动关闭
      duration: 0
    })

    // 从 vuex 中获取 token 的值
    const tokenStr = store.state.tokenInfo.token
    if (tokenStr) {
      // 只有 tokenStr 的值存在，才有必要挂载到请求头的 Authorization 属性中
      config.headers.Authorization = 'Bearer ' + tokenStr
    }

    return config
  },
  function (error) {
    // 对请求错误做些什么
    // 隐藏 loading 效果
    Toast.clear()
    return Promise.reject(error)
  }
)

// 添加响应拦截器
request.interceptors.response.use(
  function (response) {
    // 对响应数据做点什么
    // 隐藏 loading 效果
    Toast.clear()
    return response
  },
  function (error) {
    // 对响应错误做点什么
    // 隐藏 loading 效果
    Toast.clear()
    return Promise.reject(error)
  }
)

export default request
